import { CommonModal } from "@/views/components/CommonModal";
import Typography from "@/pages/OrderModule/common/components/Typography";
import { Alert, Form, InputNumber, Modal, Radio, Space, Checkbox, message } from "antd";
import { useState, useEffect } from "react";
import { find } from 'lodash';
/**
手动发货：这里针对待发货的订单可以直接操作修改状态变为已发货状态、

点击时需要判断是否勾选了订单，若没有勾选订单，则提示：请先勾选订单数据、

若勾选了数据，则这里的弹窗内的订单数为勾选的数据（需要把没有物流单号的数据剔除掉）

输入包裹重量为必填项，最小值为0.01
 *
 *  */
function ActionModal(props) {
	const { deliveryData, selectedRows, fetchList, type } = props;

	const { all, allList, forceList, normalList } = deliveryData;

	useEffect(() => {
		setVisible(true);
	}, [])

	const [visible, setVisible] = useState();

	const [form] = Form.useForm();

	function handleOk() {
		form.submit();
	}

	function onFinish(val) {
		if(allList.length == 0) {
			return message.info('没有可操作的数据');
		}
		Modal.info({
			centered: true,
			title: "是否确定手动发货?",
			okText: "确定",
			onOk() {
				/**
				 * deliveryOutboundNos [Array] 接口返回的可发货订单出库单号
				 */
				props.handleCommand(props.commandText, { outboundNos: allList, fetchList, type, formData: val }, ({ success, data }) => {
					setVisible(false);
				});
			}
		});
	}

	//是否读取订单实际重量
	const readEstimatedWeight = Form.useWatch('readEstimatedWeight', form);

	return (
		<CommonModal title={{ title: "手动发货" }} open={visible} width="520px" onCancel={props.onCancel} onOk={handleOk}>
			<Space size={32} style={{ color: '#000', marginBottom: '24px' }}>
				<span>所选订单：<span style={{ fontWeight: 600 }}>{all}</span></span>
				<span>可发货订单：<span className="common-color10" style={{ fontWeight: 600 }}>{normalList.length}</span></span>
				<span>可强制发货订单：<span className="common-color9" style={{ fontWeight: 600 }}>{forceList.length}</span></span>
			</Space>
			<Form
				name="deliver-set-modal-form"
				form={form}
				onFinish={onFinish}
				autoComplete='false'
				labelCol={{
					span: 6,
				}}
				wrapperCol={{
					span: 18,
				}}
			>
				<Form.Item name="actualWeight" label="包裹重量" rules={readEstimatedWeight ? null : [{ required: true, message: '请选择' }]}>
					<InputNumber disabled={readEstimatedWeight} controls={false} style={{ width: '320px' }} precision={2} min="0" addonAfter="kg" />
				</Form.Item>
				<Form.Item name="readEstimatedWeight" valuePropName="checked" label=" " colon={false}>
					<Checkbox onChange={() => {form.setFieldsValue({ actualWeight: undefined })}}>读取订单预估重量覆盖实际重量</Checkbox>
				</Form.Item>
				<Form.Item name="force" valuePropName="checked" extra="（待拿货的商品，将直接转库存发货不收取备货金额）" label="是否强制发货">
					<Checkbox>强制发货</Checkbox>
				</Form.Item>
			</Form>
			<Alert
				type="warning"
				message={
					<Typography as="s1">
						<p className="common-color9">注：</p>
						<p className="common-color9">1、普通订单和一单多包的订单，建议分开勾选操作</p>
						<p className="common-color9">2、如果勾选订单里有这两种订单，会跳过“一单多包”订单</p>
						<p className="common-color9">3、若订单没有获取物流单号则发货会跳过处理</p>
						<p className="common-color9">4、若订单中商品还未备货付款则处理发货时会跳过处理（强制发货除外）</p>
						<p className="common-color9">5、强制发货转库存发货只针对采购类型的商品并且是未备货未付款的商品</p>
					</Typography>
				}
			/>
		</CommonModal>
	);
}

export default ActionModal;
